import Vue from 'vue'
import VueRouter from 'vue-router'
import Layout from '@/views/Layout'
import Login from '@/views/Login/index.vue'
import Home from '@/views/Home'
//商品管理相关
const Product = () => import('@/views/Product/index.vue')
const ProductList = () => import('@/views/Product/List')
const Category = () => import('@/views/Product/Category')
const AddProduct = () => import('@/views/Product/List/AddProduct.vue')

//订单管理相关
const Order = () => import('@/views/Order/')
const OrderList = () => import('@/views/Order/List')
const Collect = () => import('@/views/Order/Collect')
const Advert = () => import('@/views/Advert/index.vue')
const AdvertList = () => import('@/views/Advert/List')

//风险相关管理
const Risk = () => import('@/views/Risk/')
const RiskVerify = () => import('@/views/Risk/RiskVerify')
const PepVerify = () => import('@/views/Risk/PepVerify')
const EtbVerify = () => import('@/views/Risk/EtbVerify')

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    component: Layout,
    meta:{
      "title": "首页",
    },
    children: [
      {
        path: '/',
        name: 'home',
        component: Home,
        meta:{
          "title": "首页",
        },
      },
      {
        path: '/product',
        name: 'product',
        component: Product,
        meta:{
          "title": "产品管理",
        },
        redirect: '/product/productlist', //重定向到产品列表， 该路径点击只是展开和关闭，并没有页面
        children: [
          {
            path: 'productlist',
            name: 'productlist',
            component: ProductList,
            meta:{
              "title": "产品列表",
            },
          },
          {
            path: 'category',
            name: 'category',
            component: Category,
            meta:{
              "title": "产品分类",
            },
          },
          {
            path: 'add-product',
            name: 'AddProduct',  //路由的名称
            component: AddProduct,
            meta:{
              activeMenu: '/product/productlist' //ProductPage通过商品列表页实现跳转，并不是从左边得到菜单栏进行跳转，所以跳转的路径不能被左边导航栏组件的$route.path识别为高亮，通过meta自定义属性标记应该高亮展示的按钮路径
            }
          },

        ],
      },
      {
        path: '/order',
        name: 'order',
        component: Order,
        meta:{
          "title": "订单管理",
        },
        children: [
          {
            path: 'orderlist',
            name: 'orderlist',
            component: OrderList,
              meta:{
              "title": "订单列表",
            },
          },
          {
            path: 'collect',
            name: 'collect',
            component: Collect,
            meta:{
              "title": "汇总清单",
            },
          },
        ],
      },
      {
        path: '/advert',
        name: 'advert',
        component: Advert,
        meta:{
              "title": "广告管理",
        },
        children: [
          {
            path: 'advertlist',
            name: 'advertlist',
            component: AdvertList,
            meta:{
              "title": "广告列表",
            },
          },
        ],
      },
      {
        path: '/risk',
        name: 'risk',
        component: Risk,
        meta:{
            "title": "风险管理",
        },
        children: [
          {
            path: 'riskverify',
            name: 'riskverify',
            component: RiskVerify,
            meta:{
              "title": "风险核实",
            },
          },
          {
            path: 'pepverify',
            name: 'pepverify',
            component: PepVerify,
            meta:{
              "title": "PEP核实",
            },
          },
          {
            path: 'etbverify',
            name: 'etbverify',
            component: EtbVerify,
            meta:{
              "title": "ETB核实",
            },
          },
          {
            path: 'communication',
            name: 'communication',
            conmponent: () => import('@/views/Risk/Communication'),
            meta:{
              "title": "父子组件通信",
            },
          },
        ],
      },
    ],
  },
  {
    path: '/login',
    name: 'login',
    component: Login,
  },
]

const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  /* 在开发环境下，process.env.BASE_URL 通常为 /，此时路由配置如下：在这种情况下，访问 /home 就能正常访问到 Home 组件
  假设你要将项目部署到服务器的 /myapp 子目录下，Vue CLI 在构建时会自动将 process.env.BASE_URL 设置为 /myapp/。
  此时路由配置保持不变：但实际访问 Home 组件的路径就变成了 /myapp/home。
  通过使用 base: process.env.BASE_URL，你无需在开发和生产环境中手动修改路由的基础路径 */
  routes,
  
})
// 获取原型对象push函数
const originalPush = VueRouter.prototype.push

// 获取原型对象replace函数
const originalReplace = VueRouter.prototype.replace

// 修改原型对象中的push函数
VueRouter.prototype.push = function push(location){
return originalPush.call(this , location).catch(err=>err)
}

// 修改原型对象中的replace函数
VueRouter.prototype.replace = function replace(location){
return originalReplace.call(this , location).catch(err=>err)
}

export default router
